<link type="text/css" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>



<!-- 文档地址 https://getbootstrap.net/docs/components/card/ -->
<div class="card" style="width: 18rem;margin: 10px auto;font-size: 14px">
	<!-- 设置图片或头像 -->
	<img class="card-img-top" src="http://b-ssl.duitang.com/uploads/blog/201505/18/20150518025109_Lfmcx.jpeg" alt="Card image cap">
	<div class="card-body">
		<!-- 标题 -->
		<h5 class="card-title">Card title</h5>
		<!-- 内容 -->
		<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
		<!-- 按钮 -->
		<a href="#" class="btn btn-primary">Go somewhere</a>
	</div>
</div>

<script type="text/javascript">
	//获取按钮组件
	var cardbtn=$('.card-body .btn');
	cardbtn.click(function(){
		//dosomething
		console.log($(this).html());
	})
</script>
